<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Gomoku alg</title>
    <link type="text/css" rel="stylesheet" href="/assets/css/style.css"/>
    <link type="text/css" rel="stylesheet" href="/assets/css/bootstrap.min.css"/>
    <link type="text/css" rel="stylesheet" href="/assets/css/bootstrap-theme.min.css"/>

</head>
<body>

<div style="position: absolute; width: 100%; height: 100%;">
    <nav class="navbar navbar-default" role="navigation">
        <div class="container-fluid " >

                <div class="navbar-form navbar-header" role="search" >
                    <div class="form-group">
                        W:
                        <input  name="w" type="number" class="form-control" placeholder="Width">
                    </div>
                    <div class="form-group">
                        H:
                        <input name="h" type="number" class="form-control" placeholder="Height">
                    </div>
                    <button style="display: none" onclick="sendSize()" class="btn btn-default">Construct</button>
                </div>
                <div class="navbar-form navbar-header" role="upload">
                    Team name
                    <div class="form-group">
                        <input name="teamName" type="text" class="form-control" id="teamName">
                    </div>
                    <div class="form-group">
                        <input name="file" class="form-control filestyle" id="fileupload" type="file" data-url="/uploadFile" data-input="false">
                    </div>
                    <button id="sendFileButton" class="btn btn-default" disabled="true">Send File</button>
                    <div class=".progress" style="width: 60px"/>
                </div>


        </div><!-- /.container-fluid -->
    </nav>
    <div class="title">
        Gomoku Brain Battle
    </div>
    <div class="fullwith" style="position: relative;">
        <div class="line playerChooser left">
            <div class="dropdown" id="teamSelector1">
                <div class="teamSelectorHeader"></div>
                <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown">
                    Select team
                    <span class="caret"></span>
                </button>
                <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1" id="teamList1">
                    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
                    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
                    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
                    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
                </ul>
            </div>
            <div id="player1Time"></div>
            <div id="player1Win" class="winTitle"></div>
        </div>

        <div class="line playboard"></div>
        <div class="line playerChooser right">
            <div class="line">
                <div class="line">
                    <div class="dropdown" id="teamSelector2">
                        <div class="teamSelectorHeader"></div>
                        <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu2"
                                data-toggle="dropdown">
                            Select team
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1" id="teamList2">

                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a>
                            </li>
                            <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
                        </ul>
                    </div>
                    <div id="player2Time"></div>
                    <div id="player2Win" class="winTitle"></div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="bottom">
    <div class="btn-group">
        <button type="button" id="startButton" disabled="true" class="btn btn-default btn-success" onclick="start()">Start</button>
    </div>
</div>
<script src="/assets/js/jquery.js"></script>
<script src="/assets/js/bootstrap.min.js"></script>
<script src="/assets/js/jquery.ui.widget.js"></script>
<script src="/assets/js/jquery.iframe-transport.js"></script>
<script src="/assets/js/jquery.fileupload.js"></script>

<script src="/assets/js/bootstrap-filestyle.js"></script>
<script src="/assets/js/game.js"></script>
</body>


</html>